<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8">
		<meta name="viewport" content="width=device-width, initial-scale=1,maximum-scale=1, user-scalable=no">
		<title>活动列表</title>
		<link rel="stylesheet" type="text/css" media="screen" href="{$staticHost}/static/css/base.css" />
		<link rel="stylesheet" type="text/css" media="screen" href="{$staticHost}/static/css/mod.css" />
		<link rel="stylesheet" type="text/css" media="screen" href="{$staticHost}/static/css/list.css" />
	
		<script src="{$staticHost}/static/js/jquery-1.8.3.min.js"></script>
		<script src="{$staticHost}/static/js/js.js"></script>
	
	</head>
	<body>
		<!-- <div class="load-ios"></div>
		<div class="load "><span></span></div> -->
		<section id="empty" class="empty-box">
			<div>
				<img src="{$staticHost}/static/images/bg/image1_03-min.png" >
				<p>群组还没有创建活动哦</p>
				
			</div>
		</section>
		<div class="refresh">
		<ul id="list" class="list-07"></ul>
		</div>
	</body>
	<script id="test" type="text/html">
		
		<% for(var i=0; i< activity.length ;i++){%>
		<li>
			<a href="<%=activity[i].url%>"></a>
			<figure>
				<img src=<%=activity[i].img%> >
				<!-- <figcaption>X人报名</figcaption> -->
			</figure>
			<div>
				<h6><%=activity[i].title%></h6>
				<dl>
					<dd class="f13"><%=activity[i].joinNum%>人参与</dd>
					<dd class="ico-money"><%=activity[i].cost%></dd>
					<dd class="ico-time">
					<%=activity[i].stime%> - <%=activity[i].etime%>
					<% if (activity[i].place.length==0){%>
					<span class="btn <%=activity[i].class%>" ><%=activity[i].msg%></span>
					<%}%>
					</dd>
					<% if (activity[i].place.length> 0){%>
					<dd class="ico-location">
					<%=activity[i].place%>
					<span class="btn <%=activity[i].class%>" ><%=activity[i].msg%></span>
					</dd>
					<%}%>
				</dl>
				<% if(activity[i].type>2){%>
				<i class="ico-official"></i>
				<%}%>
				
			</div>
			
		</li>
		
		<%}%>
	</script>
	
<script>
	var gid = getQueryStringByName('gid');
	var aid = 0;
	var time = new Date(new Date().getTime());
	time = (time.getFullYear()+"-"+(time.getMonth()+1)+"-"+time.getDate()+" "+time.getHours()+":"+time.getMinutes());

	var downTime = new Date(new Date().getTime());
	downTime = (downTime.getFullYear()+"-"+(downTime.getMonth()+1)+"-"+downTime.getDate()+" "+downTime.getHours()+":"+downTime.getMinutes());
	$(function(){
		$.getJSON('{$staticHost}/groupWeb/groupActivityList',{'gid': gid, 'aid':aid}, function(data, error) {
			var info = data.activity;
			for(var i=0;i<info.length;i++){
				info[i].url = "joggers://actDetail/"+info[i]['aid']+","+info[i]['gid'];
			}
			var item = formatActivityData(data.activity);
			if(info.length > 0){
			aid = item[item.length - 1].aid;
			}
			
			var html = template('test', data);
			document.getElementById('list').innerHTML = html;
			if( $("#list li").length==0){
			   $("#ref").css("display","none");
			   $("#empty").css("display","block");
			}
			var objul = document.getElementById("list");
			var lis=objul.getElementsByTagName("li");
			var counter = 0;
		    // 每页展示4个
		    var num = 0;
		    var pageStart = 0,pageEnd = 0;
			
			
		$('.refresh').dropload({
			scrollArea : window,
	        loadUpFn : function(me){
	            $.ajax({
	                type: 'GET',
			        url: '{$staticHost}/groupWeb/groupActivityList',
			        dataType: 'json',
			     	data:{gid:gid,aid:0},
			        success: function(data){
	                   var result = '';
			            counter++;
			            pageEnd = num * counter;
			            pageStart = pageEnd - num;
						console.info(data)
						if(data.activity.length> 0) {
							var item = formatActivityData(data.activity);
							aid = item[item.length - 1].aid;
							var html = template('test', data);
							$('#list').html(html);
			            
			          } else {
			          	console.log('no data');
			          }
	                    // 为了测试，延迟1秒加载
	                    setTimeout(function(){
	                        $('#list').append(result);
	                        // 每次数据加载完，必须重置
	                        me.resetload();
	                    },100);
	                },
	                error: function(xhr, type){
	                    alert('Ajax error!');
	                    // 即使加载出错，也得重置
	                    me.resetload();
	                }
	            });
	        }
		});
		/***下拉刷新**/
		if(lis.length>20||lis.length==20){
		    $('.refresh').dropload({
		        loadDownFn : function(me){
		        	 if(me.nodata){
		        		$(".dropload-down").html("<div class='dropload-refresh'>没有更多数据</div>");
		        		return false;
		        	}
		            $.ajax({
		                type: 'GET',
		                url: '{$staticHost}/groupWeb/groupActivityList',
		                dataType: 'json',
		                data:{gid:gid,aid:aid},
		                success: function(data){
		                    var result = '';
		                    counter++;
		                    pageEnd = num * counter;
		                    pageStart = pageEnd - num;
							console.log(data);
							if(data.activity.length> 0) {
								var item = formatActivityData(data.activity);
								aid = item[item.length - 1].aid;
								var html = template('test', data);
								$('#list').append(html);
								
		                  } else {
		                  	console.log('no data');

		                  }
		                    // 为了测试，延迟1秒加载
		                    setTimeout(function(){
		                        $('.list-07').append(result);
		                        // 每次数据加载完，必须重置
		                        me.resetload();
		                    },1000);
		                },
		                error: function(xhr, type){
		                    alert('Ajax error!');
		                    // 即使加载出错，也得重置
		                    me.resetload();
		                }
		                
		            });
		        }
		    });
			}
			/***上拉加载***/
		});
	
	});
	/***数据渲染***/
	function getQueryString() {
    var result = location.search.match(new RegExp("[\?\&][^\?\&]+=[^\?\&]+", "g"));
    for (var i = 0; i < result.length; i++) {
        result[i] = result[i].substring(1);
	    }
	    return result;
	}
	//根据QueryString参数名称获取值
	function getQueryStringByName(name) {
	    var result = location.search.match(new RegExp("[\?\&]" + name + "=([^\&]+)", "i"));
	    if (result == null || result.length < 1) {
	        return "";
	    }
	    return result[1];
	}
	//根据QueryString参数索引获取值
	function getQueryStringByIndex(index) {
	    if (index == null) {
	        return "";
	    }
	    var queryStringList = getQueryString();
	    if (index >= queryStringList.length) {
	        return "";
	    }
	    var result = queryStringList[index];
	    var startIndex = result.indexOf("=") + 1;
	    result = result.substring(startIndex);
	    return result;
	}
	/***获取aid  gid**/
    

	function formatActivityData(item) {
		if(item.length) {
			var timestamp = Date.parse(new Date()).toString();
			timestamp = timestamp.substr(0,10)
			
			for(var i in item){
				var info=item[i];
				if(info.stime > timestamp){
					info.msg='报名中';
					
				}else if(timestamp > info.stime && timestamp < info.etime){
					info.msg='进行中';
				}

				if(info.isJoin == 1){
					info.msg='已参加';
				}
				if(timestamp > info.etime){
					info.msg='已结束';
				}
				if(info.status ==1 ){
					info.msg='已取消';
				}
				var d = new Date(new Date(parseInt(info.stime) * 1000).getTime());
				info.stime =(d.getFullYear()+"."+(d.getMonth()+1)+"."+d.getDate());
				var q = new Date(new Date(parseInt(info.etime) * 1000).getTime());
				info.etime =(q.getFullYear()+"."+(q.getMonth()+1)+"."+q.getDate());

				
				info.cost = info.cost*1 > 0 ? info.cost : '免费';
				
				if(info.msg == '已参加') {
					info.class = 'bg_rose';
				} else if(info.msg == '报名中'){
					info.class = 'bg_blue';
				} else if(info.msg == '已结束'){
					info.class = 'bg_gray';
				}else if(info.msg == '进行中'){
					info.class = 'bg_orange';
				}else{
					info.class = 'bg_gray';
				}
				info['url'] = "joggers://actDetail/"+info.aid+","+info.gid;
				item[i] = info;
			}
		}
		
		return item;
	}
	/***时间显示***/
</script>
<script type="text/javascript">

	var browser = {
	versions: function() {
	var u = navigator.userAgent, app = navigator.appVersion;
	return {//移动终端浏览器版本信息 
	trident: u.indexOf('Trident') > -1, //IE内核
	presto: u.indexOf('Presto') > -1, //opera内核
	webKit: u.indexOf('AppleWebKit') > -1, //苹果、谷歌内核
	gecko: u.indexOf('Gecko') > -1 && u.indexOf('KHTML') == -1, //火狐内核
	mobile: !!u.match(/AppleWebKit.*Mobile.*/) || !!u.match(/AppleWebKit/), //是否为移动终端
	ios: !!u.match(/\(i[^;]+;( U;)? CPU.+Mac OS X/), //ios终端
	android: u.indexOf('Android') > -1 || u.indexOf('Linux') > -1, //android终端或者uc浏览器
	iPhone: u.indexOf('iPhone') > -1 || u.indexOf('Mac') > -1, //是否为iPhone或者QQHD浏览器
	iPad: u.indexOf('iPad') > -1, //是否iPad
	webApp: u.indexOf('Safari') == -1 //是否web应该程序，没有头部与底部
	};
	}(),
	language: (navigator.browserLanguage || navigator.language).toLowerCase()
	}
	 
	if (browser.versions.ios || browser.versions.iPhone || browser.versions.iPad) {
		$(".load-ios").css('display','block')
		window.onload=function(){
		$(document).ready(function() { 
		 		 $(".load-ios").css('display','none')
			}); 
		};
	}else if (browser.versions.android) {
	$(".load").css('display','block')
		window.onload=function(){
		$(document).ready(function() { 
		 		 $(".load").css('display','none')
			}); 
		};
	}	
</script>

<script src="{$staticHost}/static/js/dropload.min.js"></script>
{template 'show/web-footer'}